<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" charset="utf-8"/>
  <title><%= yield(:title) %></title>
    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
    <%= javascript_include_tag 'application' %>
    <%= csrf_meta_tags %>
</head>
<body style="background: #FFFEE1;">
<div data-role="page">

  <div data-role="panel" id="leftpanel" data-position="left" data-display="reveal" data-theme="a" 
  class="ui-panel ui-panel-position-left ui-panel-display-reveal ui-body-a ui-panel-animate">
    <div class="ui-panel-inner">
      <fieldset data-role="controlgroup">
        <legend>Pop a memo!</legend>
        <a href="#" class="ui-shadow ui-btn ui-corner-all ui-icon-user ui-btn-icon-right">Sign</a>
        <a href="#" class="ui-shadow ui-btn ui-corner-all ui-icon-grid ui-btn-icon-right">Pipe</a>
        <a href="#" class="ui-shadow ui-btn ui-corner-all ui-icon-navigation ui-btn-icon-right">Surf</a>
      </fieldset>
    </div>  
  </div>

  <div data-role="header">
    <div data-role="navbar" data-iconpos="left">
      <ul>
        <li><a href="#leftpanel" data-icon="bullets">便乎</a></li>
      </ul>
    </div><!-- /navbar -->
  </div>

  <div role="main" class="ui-content">
    <%= yield %>
  </div>

  <div data-role="footer">
    <div data-role="navbar" data-iconpos="right">
          <ul>
              <li><a href="<%= memos_path %>" data-icon="tag" >Memos</a></li>
              <li><a href="<%= new_memo_path %>" data-icon="edit">Pop</a></li>
              <li><a href="#" data-icon="eye">Talk</a></li>
          </ul>
    </div>
  </div>

</div>
</body>
</html>
